<template>
  <div class="index_first">
<!--    <el-button-->
<!--        class="my_button"-->
<!--        type="success"-->
<!--        -->
<!--        text-->
<!--    >-->
<!--      -->
<!--    </el-button>-->
    <el-text
        @click="goFrontDesk"
        class="my_button"
    >
      Go to the front desk
    </el-text>
  </div>
</template>

<script setup name="Index">
function goFrontDesk(){
  const serverIP = window.location.hostname; // 结果："8.148.27.34"（公网IP）
  // 拼接服务器IP + 81端口（你要跳转的地址）
  window.location.href = `http://${serverIP}:81/`;
  //window.location.href = 'http://localhost:81/';
}
</script>

<style scoped>
.index_first{
  display: flex;
  justify-content: center; /* 水平居中 */
  align-items: center; /* 垂直居中 */
  height: 100vh; /* 设置父元素高度为视口高度，以便垂直居中效果明显 */
}
.my_button{
  padding: 0 10px;
  font-size: 100px;
  font-family: 华文新魏,serif;
  background-color: #c0ebd7;
  border-radius: 30px;
  cursor: pointer; /* 鼠标悬停显示小手 */
  /* 可选优化：添加 hover 时的样式过渡，体验更好 */
  transition: background-color 0.3s ease;
}
</style>

